<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Menghitung Luas Persegi Panjang</title>
<script type="text/javascript">
	function hitungLuas(){
	Panjang = document.getElementById("txtPanjang").value;
	Lebar = document.getElementById("txtLebar").value;
	Luas = Panjang * Lebar; document.getElementById("txtLuas").value = Luas;}
</script>
</head>
<body>
<style>
	table {background-color:#0066FF; box-shadow: 0px 30px 50px #000;}
	td {font-family:cursive; font-size:20px; color:#000000; font-weight:bolder;}
	input { font-family:impact; font-size:25px; color:#FFFFFF; background-color:#666666;}
</style>
<font face="Times New Roman">
<center><h2><b>Menghitung Luas Persegi Panjang</b></h2></center>
<table align="center" cellspacing="20">
	<tr>
		<td>Panjang</td>
		<td>:</td>
		<td><input type="text" id="txtPanjang" name="txtPanjang" /></td>
	</tr>
	<tr>
		<td>Lebar</td>
		<td>:</td>
		<td><input type="text" id="txtLebar" name="txtLebar" /></td>
	</tr>
	<tr>
		<td><td><td><input type="button" id="btnHitung" value="Hitung Luas" onclick="hitungLuas();"></td></td></td>
	</tr>
	<tr>
		<td>Luas</td>
		<td>:</td>
		<td><input type="text" id="txtLuas" name="txtLuas" /></td>
	</tr>
</body>
</html>